import { Component, useEffect } from "react";
import { useSelector } from "react-redux";
import { useDispatch } from "react-redux";
import {getKindListFn} from "./api/kind";
import{changekindList} from "./store/modules/kind"
export default function Kind() {

    //获取修改方法dispatch
    const dispatch = useDispatch()
    //获取全局状态的kindList
    const kindList = useSelector(state => state.kind.kindList)

    useEffect(()=>{
      getKindListFn().then(res=>{
        // console.log(res)
         //将数据放入全局状态
    dispatch(changekindList(res.data.data))
      })
    })
  return (
    <div>
      <h1>Kind</h1>
      <ul>
        {kindList.map(item=><li key={item}>{item}</li>)}
      </ul>
    </div>
  );
}